<script setup lang="jsx">
import {inject, onMounted, ref} from "vue";
import DataGrid from "@cps/DataGrid/DataGrid.vue";
import {Message} from "@arco-design/web-vue";
import parcel from "@/api/document/parcel.js";

const visible = defineModel()
const record = inject('record',{})
const userData = ref([])
const ups = ref('')
const columns = ref([
  {title: '运单号/箱号', data: 'number', readOnly: true},
  {title: '扩展箱号', data: 'ext_number',readOnly: true},
  {title: '承运商代码', data: 'outer_carrier_code',required:true},
  {title: '转单号', data: 'outer_carrier_tracking_number'},
  {title: '主单号', data: 'is_main_ups',type: 'checkbox', checkedTemplate: '1', uncheckedTemplate: '0'},
])
onMounted(()=>{
  if(!record.value.parcel){
    return
  }
  userData.value.length = 0
  let first_is_main_ups = true
  record.value.parcel.map((i,k)=>{
    // if(k == 0 && !i.outer_carrier_tracking_number){
    //   i.is_main_ups = '1'
    // }
    if(i.outer_carrier_tracking_number && i.outer_carrier_tracking_number == i.main_ups){
      i.is_main_ups = '1'
      first_is_main_ups = false
    }
  })
  if(first_is_main_ups && !record.value.parcel[0].outer_carrier_tracking_number){
    record.value.parcel[0].is_main_ups = '1'
  }
  userData.value.push(...JSON.parse(JSON.stringify(record.value.parcel)))
})

const getRecord = inject('getRecord')
const submit = async () => {
  let data = []
  for(let k in userData.value){
    let i = userData.value[k]
    if(i.id){
      if(i.outer_carrier_code != record.value.parcel[k].outer_carrier_code ||
         i.outer_carrier_tracking_number != record.value.parcel[k].outer_carrier_tracking_number ||
         i.is_main_ups != record.value.parcel[k].is_main_ups
      ){
        data.push({
            id:i.id,
            is_main_ups:i.is_main_ups,
            main_ups:i.main_ups,
            outer_carrier_code:i.outer_carrier_code,
            outer_carrier_tracking_number:i.outer_carrier_tracking_number
          })
      }
    }
  }
  // console.log(data)
  let res = await parcel.turn(data)
  if(!res.success){
    Message.error(res.message)
    return false;
  }
  Message.info(res.message)
   getRecord(true)
  visible.value = false
}
const cancel = () => {
  visible.value = false
}
const upsGet = async (type) =>{
  if(ups.value.length == 0){
    Message.error('请输入ups主单号')
    return;
  }
  let res = await parcel.getUps({shipment_id:record.value.id,ups_code:ups.value})
    if(!res.success){
      Message.error(res.message)
      return false;
    }
  userData.value.map((i,k)=>{
      if(i.number){
        if(type == 1 || (type == 2 && !i.outer_carrier_tracking_number)){
          i.outer_carrier_code = res.data[k].outer_carrier_code
          i.outer_carrier_tracking_number = res.data[k].outer_carrier_tracking_number
          i.is_main_ups = 0
          i.main_ups = res.data[k].main_ups
        }
      }
  })
  if(type == 1){
    
  }else{

  }
}
</script>

<template>
  <a-drawer
      :visible="visible"
      title="转单号回填"
      width="70%"
      :destroyOnClose="true"
      :getContainer="false"
      :style="{position: 'absolute'}"
      @cancel="cancel"
      @ok="submit"
  >
      <a-input v-model="ups" placeholder="请输入UPS主单号" />
      <a-popconfirm
      content="确定覆盖吗?"
      position="bottom"
      @click.stop=""
      @ok="upsGet(1)"
      >
        <a-button type="primary">获取并覆盖</a-button>
      </a-popconfirm>

      <a-popconfirm
      content="确定追加吗?"
      position="bottom"
      @click.stop=""
      @ok="upsGet(2)"
      >
        <a-button type="primary">获取并追加</a-button>
      </a-popconfirm> 
    <data-grid :columns="columns"  :minSpareRows="0" v-model="userData"/>
    <template #footer>
      <a-button @click="cancel">取消</a-button>
      <a-button type="primary" @click="submit">确定</a-button>
      <!-- <a-button type="primary" status="danger" @click="clearNumber">清空转单号</a-button> -->
    </template>
  </a-drawer>
</template>

<style scoped>

</style>